<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>sdl</title>
</head>

<body>
    ss
    <script src="./md5.js"></script>
    <script>
        // 使用canvas生成浏览器指纹
        const createBrowserFingerprint = () => {
            const canvas = document.createElement("canvas")
            const ctx = canvas.getContext("2d")
            ctx.fillRect(0, 0, 100, 100)
            // md5缩短下指纹
            return md5(canvas.toDataURL())
        }
        const ws = new WebSocket("ws://127.0.0.1:3000")
        ws.onopen = () => {
            ws.send(JSON.stringify({
                id: 1,
                fingerprint: createBrowserFingerprint(),
                action: "login"
            }))
        }
        ws.onmessage = (event) => {
            const data = JSON.parse(event.data)
            if (data.action === "logout") {
                alert(data.message)
            }
        }
    </script>
</body>

</html>